<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title>DataGrid 数据表格</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <!--link href="demo.css" rel="stylesheet" type="text/css" />  -->

    <script src="../../scripts/boot.js" type="text/javascript"></script>
</head>

<body>

    <style type="text/css">
        html,
        body {
            margin: 0;
            padding: 0;
            border: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }
    </style>

    <h1>图书信息列表</h1>
    <div style="width:100%;">
        <div class="mini-toolbar" style="border-bottom:0;padding:0px;">
            <table style="width:100%;">
                <tr>
                    <td style="width:100%;">
                        <a class="mini-button" iconCls="icon-add" onclick="add()">新增图书</a>
                        <a class="mini-button" iconCls="icon-remove" onclick="remove()">删除</a>
                    </td>
                    <td style="white-space:nowrap;">
                        <label style="font-family: Verdana">图书名称：</label>
                        <input id="bookname" class="mini-textbox" emptyText="请输入图书名称" style="width:150px;"
                            onenter="onKeyEnter" />
                        <label style="font-family: Verdana">图书类别：</label>
                        <input id="booktype" showNullItem="true" class="mini-combobox" url="../../data/book.txt"
                            textField="text" valueField="id" />
                        <a class="mini-button" onclick="search()">查询</a>
                    </td>
                </tr>
            </table>
        </div>
    </div>


    <div class="mini-fit">
        <div id="datagrid1" class="mini-datagrid" style="width:100%;height:100%;" allowResize="true"
            url="../../BookInfoListAction?method=getbookinfolist" idField="id" multiSelect="true">
            <div property="columns">
                <div type="checkcolumn"></div>
                <div type="indexcolumn" width="50" headerAlign="center">序号</div>
                <div field="bookid" width="0" headerAlign="center">编号</div>
                <div field="bookname" width="100" headerAlign="center">书名</div>
                <div field="publisher" width="100" headerAlign="center">出版社</div>
                <div field="author" width="100" headerAlign="center">作者</div>
                <div field="booktype" width="100" headerAlign="center" renderer="bookTextRenderer">类型</div>
                <div field="remain" width="100" headerAlign="center" renderer="bookfont">剩余数量</div>
                <div width="150" headerAlign="center" renderer="onActionRenderer">操作</div>
            </div>
        </div>
    </div>


    <script type="text/javascript">
        mini.parse();
        var grid = mini.get("datagrid1");
        grid.load();

        var bookTypes;
        getBookType();
        function getBookType() {
            $.ajax({
                url: "../../data/book.txt",
                success: function (text) {
                    bookTypes = mini.decode(text);
                },
                error: function () {
                    console.log("error");
                }
            });
        }


        function search() {
            var bookname = mini.get("bookname").getValue();
            var booktype = mini.get("booktype").getValue();
            grid.load(
                {
                    bookname: bookname,
                    booktype: booktype
                }
            );
        }
        function onKeyEnter(e) {
            search();
        }


        function bookTextRenderer(e) {
            for (var i = 0; i < bookTypes.length; i++) {
                if (e.value == bookTypes[i].id) {
                    return bookTypes[i].text;
                }
            }
        }


        function add() {
            mini.open({
                url: "pages/bookinfo/bookinfoadd.html",
                title: "新增书籍", width: 600, height: 200,
                onload: function () {
                    var iframe = this.getIFrameEl();
                    var data = { action: "new" };
                },
                ondestroy: function (action) {
                    grid.reload();
                }
            });
        }

        function bookfont(e) {
            if (e.value <= 10) {
                e.cellStyle = "color:#F00;font-weight:bold;";
            }
            return e.value;
        }



        function remove() {
            var rows = grid.getSelecteds();
            if (rows.length > 0) {
                mini.confirm("确认删除选中记录？", "提示信息：", function (action) {
                    if (action == 'ok') {
                        var ids = [];
                        for (var i = 0, l = rows.length; i < l; i++) {
                            var r = rows[i];
                            ids.push(r.bookid);
                        }
                        var id = ids.join(',');
                        grid.loading("操作中，请稍后......");
                        $.ajax({
                            url: "../../bookinfoeditaction?method=deleteBookInfo&id=" + id,
                            success: function (text) {
                                var o = mini.decode(text);
                                mini.alert(o.msg);
                                grid.reload();
                            },
                            error: function () {
                            }
                        });
                    }
                });

            } else {
                mini.alert("请选中一条记录");
            }
        }


        function detail(bookId) {
            mini.open({
                url: "pages/bookinfo/bookinfodetail.html",
                title: "图书详情", width: 600, height: 200,
                onload: function () {
                    var iframe = this.getIFrameEl();
                    var data = { bookId: bookId };
                    iframe.contentWindow.SetData(data);
                },
                ondestroy: function (action) {
                    grid.reload();

                }
            });
        }




        function onActionRenderer(e) {
            record = e.record;
            return '&nbsp;&nbsp;&nbsp;&nbsp;<a class="mini-button" iconCls="icon-edit" onclick="editBookInfo(\'' + record.bookid + '\')">编辑</a> <a class="mini-button" iconCls="icon-add" onclick="remove()">删除</a> <a class="mini-button" iconCls="icon-add" onclick="borrow(\'' + record.bookid + '\')">借阅</a> <a class="mini-button" iconCls="icon-add" onclick="detail(\'' + record.bookid + '\')">详情</a>'
        }


        function editBookInfo(bookId) {
            mini.open({
                url: "pages/bookinfo/bookeidter.html",
                title: "编辑图书", width: 600, height: 200,
                onload: function () {
                    var iframe = this.getIFrameEl();
                    var data = { bookId: bookId };
                    iframe.contentWindow.SetData(data);
                },
                ondestroy: function (action) {
                    grid.reload();
                }
            });
        }


        function borrow(bookId) {
            mini.open({
                url: bootPATH + "../pages/bookinfo/borrowinfoadd.html",
                title: "新增借阅信息",
                width: 600,
                height: 400,
                onload: function () {
                    var iframe = this.getIFrameEl();
                    var data = { bookId: bookId };
                    iframe.contentWindow.SetData(data);
                },
                ondestroy: function (action) {
                    grid.reload();
                }
            });
        }
    </script>
</body>

</html>